// .jsx -> .tsx
// Hello -> App
// 父组件 向 子组件提供props jsx 输出
// 子组件打工的，prop-types 拒接裸奔
// 面向对象中,特性 父子组件间的约定 负责
// interface 接口
import * as React from 'react'
// 定义一个接口,父组件件间用
// 子组件需要props 规定的接口属性和方法
// ts 语法能力 面向对象的能力更牛逼
// ts 可以让我们jsva 一样
// 接口定义区域
interface Props {
    userName: string;
    age: number;
}
// 接口和组件结合 组件要实现接口
// props {} 空对象
// 泛型  
// React.FC 类型定义由@types/react 提供
const HelloComponent: React.FC<Props> = (props) => {
    return (
        <h2>
            hello user: {props.userName}!
            <br />
            年纪: {props.age}!
        </h2>
    )
}

export default HelloComponent